<template>
  <div class="about">
    <h1>This is an about page</h1>
    <div>
      {{!isloding?'假的':'真的'}}
    </div>
    <div>{{!istop?'假的':'真的'}}</div>
    <button @click="setLoadingT">真假</button>
  </div>
</template>

<script>
import {mapActions,mapGetters,mapMutations,mapState} from 'vuex'

export default {
  data(){
    return {
      istop:false
    }
  },
  computed:{
    ...mapState({
      isloding:state=>state.top.isloding
    })
  },
  watch:{
    isloding(nextSatae,prevState){
      console.log(nextSatae,prevState)
      this.istop = nextSatae
    }
  },
  methods:{
    // ...mapMutations(['setLoading']),
    ...mapActions(['setLoading']),
    setLoadingT(){
      console.log(this)
      this.setLoading(!this.isloding)
    }
  }
}
</script>